<template>
    <div class="login-container">
        <van-nav-bar 
            class="app-nav-bar"
            title="注册 / 登录"
            left-arrow
            @click-left="$router.back()"
        />

        <van-form
            :show-error = "false"
            :show-error-message ="false"
            validate-first
            ref="login-form"
            @submit="onLogin"
            @failed="onFailed"
        >
            <van-field
                v-model="user.mobile"
                icon-prefix="toutiao"
                lef-icon="shouji"
                center
                placeholder="请输入手机号"
                name="mobile"
                :rules = formRules.mobile
            />
            <van-field
                v-model="user.code"
                icon-prefix="toutiao"
                lef-icon="yanzhengma"
                center
                placeholder="请输入验证码"
                name="code"
                :rules = formRules.code
            >
                <template #button>
                    <van-count-down 
                        v-if="isCountDownShow"
                        :time="1000 * 60"
                        format="ss s"
                        @finish="isCountDownShow = false"
                    />

                    <van-button
                        v-else
                        class="send-btn"
                        size="mini"
                        round
                        :loading="isSendSmsLoading"
                        @click.prevent="onSendSms"
                    >发送验证码</van-button>
                </template>
            </van-field>

            <div class="login-btn-wrap">
                <van-button
                    class="login-btn"
                    type="info"
                    block
                >登录</van-button>
            </div>
        </van-form>
    </div>
</template>

<script>
export default {
    data() {
    }
}
</script>
